<style>
    .d {
        width: 40px;
        height: 40px;
        display: inline-block;
        margin: 5px;
    }
    .r {
        background-color: red;
    }
    .b {
        background-color: blue;
    }
    <?php
        for ($i=0; $i < 5; $i++) {
    ?>
    .c<?=$i?> {
        display: inline-block;
        width: <?= ($i+1)*10 ?>px;
    }
    <?php
        }
    ?>
</style>
<?php
// 语法
// while( 条件 ) {
//     // 循环体。 当条件为 true时，会执行循环体中的代码，否则会退出该循环。
// }

// 必定会先执行一次 循环体中代码。
// do {
//     // 循环体。当条件为 true时，会执行循环体中的代码，否则会退出该循环。
// }
// while( 条件 );

// 初始值、步长 可以为空，即可以省略，那么此时的 for循环的作用类似 while。
// for ( 初始值; 条件; 步长 ) {
//     // 循环体
// }
/*
第一次 根据变量初始值 判断 条件是否为 true,
如果为false，直接结束for循环；
如果为true，执行循环体中代码；
然后对变量进行 步长的 改变，然后 再 进行条件判断 ，后续的的操作，类似一开始。
*/

// for ( $i = 0; $i < 5; $i++ ) {

//     echo "<h4>$i</h4>";
// }

/*
foreach 主要用于 遍历数组
$variable 表示 要遍历的 数组变量
$key 表示 数组中 当前元素的 key(下标) 存放的变量。( $key => 可以省略)
$value 表示 数组中 当前元素的 值。
*/
// foreach ( $variable as $key => $value ) {
//     // 循环体
// }
// 省略后 
// foreach ( $variable as $value ) {
//     // 循环体
// }

// $arr = [1,3,5,7];
// foreach ($arr as $key => $value) {
//     echo "<h4>$key=$value</h4>";
// }
// $arr2 = [1,3,5,7];
// foreach ($arr2 as $value) {
//     echo "<h4>$value</h4>";
// }


// $arr = [1,3,5,7,9,11];
// foreach ($arr as $key => $value) {
//     echo "<h2>$key=$value</h2>";
//     if($key%2 == 0){// 跳过下标为偶数的元素
//         continue;
//     }
//     echo "<h4>$key=$value</h4>";
// }

/*
1.输出 三位数中所有的 水仙花数。字体为红色。一行一个水仙花数。
水仙花数(三位数): 153 = 1*1*1 + 5*5*5 + 3*3*3;
*/
// echo 1*1*1 + 5*5*5 + 3*3*3;
// for ($i=100; $i < 1000; $i++) { 
//     $a = $i%10;//个
//     $b = ($i%100 - $a) / 10;// 十
//     $c = ($i - $i%100) / 100;// 百
//     if( $i == ($a*$a*$a + $b*$b*$b + $c*$c*$c) ){
//         echo "<div style='color:red;' >$i</div>";
//     }
// }
// for ($i=1; $i <= 9; $i++) { 
//     for ($j=0; $j <= 9; $j++) { 
//         for ($k=0; $k <= 9; $k++) { 
//             $n = $i*100+$j*10+$k;
//             if( $n == ($i*$i*$i + $j*$j*$j + $k*$k*$k) ){
//                 echo "<div style='color:red;' >$n</div>";
//             }
//         }
//     }
// }

/*
2.输出 0~100的 奇数的总和
*/
// $total = 0;
// for ($i=0; $i <= 100; $i++) { 
//     if($i%2 == 1){
//         $total += $i;
//     }
// }
// echo $total;

/*
3.输出 9 * 9 乘法表，格式如下：
1*1=1
2*1=2  2*2=4
3*1=3  3*2=6  3*3=9
...

9*1=9      ...         9*9=91
*/
// for ($i=1; $i <= 9; $i++) { 
//     for ($j=1; $j <= $i; $j++) { 
//         echo "<div class='c1' >$i*$j=" . ($i*$j) . "</div>";
//     }
//     echo "<br>";
// }

/*
***
***
***

*****
** **
* * *
** **
*****

*******
**   **
* * * *
*  *  *
* * * *
**   **
*******
*/

$d1 = "<div class='d r' ></div>";
$d2 = "<div class='d ' ></div>";

echo "$d1$d1$d1$d1$d1"."<br>";
echo "$d1$d1$d2$d1$d1"."<br>";
echo "$d1$d2$d1$d2$d1"."<br>";
echo "$d1$d1$d2$d1$d1"."<br>";
echo "$d1$d1$d1$d1$d1"."<br>";

echo "$d1$d1$d1$d1$d1$d1$d1"."<br>";
echo "$d1$d1$d2$d2$d2$d1$d1"."<br>";
echo "$d1$d2$d1$d2$d1$d2$d1"."<br>";
echo "$d1$d2$d2$d1$d2$d2$d1"."<br>";
echo "$d1$d2$d1$d2$d1$d2$d1"."<br>";
echo "$d1$d1$d2$d2$d2$d1$d1"."<br>";
echo "$d1$d1$d1$d1$d1$d1$d1"."<br>";

?>


<!-- <?php
for ($i=0; $i < 5; $i++) { 
    // echo "<h1>test</h1>";
?>
<h2>test</h2>;
<?php
}
?> -->

<?php
for ($i=0; $i < 5; $i++) { 
    // echo "<h1>$i</h1>";
?>
<h2 >$i=<?= $i ?></h2>
<?php
}
?>